import { DuxuiIcon, Space, Header, ScrollView, TopView, GroupList } from '@/components'

export default function IconExample() {
  return <TopView>
    <Header title='Icon' />
    <ScrollView>
      <GroupList>
        <GroupList.Item title='基础用法'>
          <DuxuiIcon name='direction_left' />
        </GroupList.Item>
        <GroupList.Item title='大小'>
          <DuxuiIcon name='pengyouquan' size={72} />
        </GroupList.Item>
        <GroupList.Item title='颜色' desc=''>
          <Space row>
            <DuxuiIcon name='close' color='red' />
            <DuxuiIcon name='weixin' color='blue' />
            <DuxuiIcon name='select' color='green' />
            <DuxuiIcon name='xuanzhong' color='orange' />
          </Space>
        </GroupList.Item>
        <GroupList.Item title='说明' desc='Icon并不是一个具体的组件，而是通过 `yarn duxapp icon DuxuiIcon duxuiExample css地址` 命令创建，创建后就是一个可以使用的Icon组件'>
        </GroupList.Item>
      </GroupList>
    </ScrollView>
  </TopView>
}
